<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="../css/index.css">
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
</head>

<body>
    <main>
        <div class="left">
            <img src="../img/index.png" alt="">
        </div>
        <div id="index" class="right" >
            <div class="form" >
                <h1>菩提阁外卖</h1>
                <form method="post" @submit="tip">

                    <br>
                    <label for="">用户名：</label>
                    <input type="text" name="username" v-model="user.username">
                    
                    <br>
                    <label for="">密码：</label>
                    <input type="password" name="password" id="password" v-model="user.password">
                    
                    <br>
                    <input  type="submit" value="登入" class="submit">
                </form>
            </div>


        </div>

    </main>


</body>
<script src="../js/vue.js"></script>
<script src="../js/axios.min.js"></script>
<script src="https://unpkg.com/element-ui/lib/index.js"></script>

<script>
    var index = new Vue({
        el:"#index",
        data:{
            user:{
                username:'',
                password:'',
            },
            message:"123",
            show:false,
        },
        methods: {
            
            tip(e) {
                console.log("点击了");
                e.preventDefault();
                that=this;
                console.log(this.user);
                axios.post('/rbac/login/okLogin',this.user)
                .then(res => {

                    if(res.data.code == 20041){
                        that.show = false;
                        console.log(this.show);
                        window.location.href="index.html";
                    }else {
                        this.$message.error(res.data.message);
                        that.show = true;
                    }
                })
                .catch(err => {
                    console.error(err); 
                })

            }
        },
        
    })
</script>
</html>